import React, { Component } from 'react';
import moment from 'moment';

import { Form, Input, Button, Checkbox, Row, Col, Upload, Cascader, Select, Radio, DatePicker, Tabs, TimePicker, Table } from 'antd';
import { LoadingOutlined, PlusOutlined, CloseCircleOutlined } from '@ant-design/icons';

const { Option } = Select;
const { RangePicker } = DatePicker;
const { TabPane } = Tabs;


import axios from '@src/lib/axios';
import Ckeditor from '@src/components/ckeditor/Ckeditor';
import Room from './component/Room';
import BaseInfo from './component/BaseInfo';
import ImgManager from './component/ImgManager';

import '@src/style/product.scss';
import PageTitle from "@src/components/PageTitle";

export default class Product extends Component {
    //static contextType = ApiContext;
    state = {
        area: [],
        activeKey: '1',
        supplier: [],
        hotel_id: '',
        filesList: []
    };

    onChangeHandler = (k, v) => {
        console.log(k, v);
        this.setState({ [k]: v });
    };

    getArea = () => {
        axios.post('/area_load', { id: 7 }).then(res => {
            if (res.code === 0) {
                let data = res.data;
                this.setState({ area: data });
            }
        });
    }
    getSupplier = () => {
        axios.post('/product/hotel/hotel_company_list').then(res => {
            if (res.code === 0) {
                this.setState({ supplier: res.data });
            }
        });
    }

    UNSAFE_componentWillMount() {
        let { hotel_id } = this.props.location.state || {};
        if (!!hotel_id) {
            this.onChangeHandler('hotel_id', hotel_id);
        }
        this.getArea();
        this.getSupplier();
    }
    render() {
        let { area, activeKey, supplier, hotel_id, filesList } = this.state;


        return (
            <div style={{padding: '0 0 100px 15px', background: '#fff'}}>
                <PageTitle title={ hotel_id? '编辑酒店' : '添加酒店' } showBack />
                <Tabs defaultActiveKey={'1'} activeKey={activeKey} onChange={(v) => this.onChangeHandler('activeKey', v)}>
                    <TabPane tab="基本信息" key="1">
                        <BaseInfo
                            activeKey={activeKey}
                            area={area}
                            supplie={supplier}
                            hotel_id={hotel_id}
                            onChangeHandler={this.onChangeHandler}
                        />
                    </TabPane>
                    {
                        hotel_id !== ''? (
                            <TabPane tab="酒店房型" key="2">
                                <Room hotel_id={hotel_id} />
                            </TabPane>
                        ) : null
                    }
                    {
                        hotel_id !== ''? (
                            <TabPane tab="图片管理" key="3">
                                <ImgManager hotel_id={hotel_id}/>
                            </TabPane>
                        ) : null
                    }
                </Tabs>
            </div>
        )
    }
}